<!--刷新-->
<template>
  <div class="bg" @click="click">
    <LImage :class="[isMin ? 'img-min' : 'img-max']" ref="refresh" :src="Config.img(image)"></LImage>
  </div>
</template>

<style src="@/_css/style.css" ></style>
<style scoped>
.bg{
  align-items: center;
  justify-content: center;
}
.img-max {
  width: 32px;
  height: 32px;
}
.img-min{
  width: 26px;
  height: 26px;
}
</style>

<script>

import jconfig from "@/_js/config";
import janimation from "@/_js/animation";

export default {
  
  props: {
    spinKey:{
      type:String,
      default:'refresh',
    },

    rotate:{ //turn 旋转中
      type:Boolean,
      default:false,
    },

    image:{
      type:String,
      default:'v2_shuaxin.png',
    },

    isMin:{ //turn 小的按钮
      type:Boolean,
      default:false,
    }
  },

  watch: {
    rotate: {
      deep: true,
      handler (val, oldVal) {
        if (val == oldVal) return;
        if (val) {
          janimation.start(this.spinKey, this.$refs.refresh, 1000, 360, -1);
        } else {
          janimation.end(this.spinKey, this.$refs.refresh);
        }
      }
    }
  },

  data() {
    return {
      Config:jconfig,
    };
  },

  created() {
  },

  methods: {
    /********************************** 点击触发*/
    //刷新
    click(){
      if(this.rotate) {
        return;
      }
      this.$emit("click");
    },
  }
}
</script>

